<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../首页/nav1.css">
    <link rel="stylesheet" href="../首页/xuanxk2.css">
    <script src="../后台/axios.min.js"></script>
    <link rel="stylesheet" href="weibu.css">

    <style>
        * {
            margin: 0;
            padding: 0;
        }

        figure {
            width: 1100px;
            margin: auto;
            /* background-color: white; */

        }

        .life {
            width: 390px;
            float: left;
            margin-top: 20px;
        }

        .face-box {
            width: 390px;
            height: 390px;
            text-align: center;
            display: table-cell;
            vertical-align: middle;
            border: 1px #dcdcdc solid;

        }

        .face-box img {
            max-width: 400px;
            max-height: 400px;
            display: inline-block;
            vertical-align: middle;
        }

        .right {
            width: 680px;
            margin-left: 30px;
            float: left;
            position: absolute;
            top: 20px;
            left: 460px;
            /* background-color: white; */
        }

        .title {
            font-size: 20px;
            margin-bottom: 10px;
        }

        .price-box {
            background: #faf5f9;
            overflow: hidden;
            padding: 10px;
        }

        .price {
            float: left;
            font-size: 50px;
            color: #f46;
        }

        .fr {
            margin-right: 10px !important;

        }

        .fr i {
            font-size: 22px;
            float: right;
        }

        i {
            font-size: 24px;
            font-style: normal;
        }

        .now {
            font-size: 50px;
            color: #f46;
        }

        .sale {
            float: right;
            color: #999;
            margin-top: 7px;
            /* float: right; */
        }

        .shu {
            display: inline-block;
            width: 100%;
            margin-top: 10px;
            color: #999;
        }

        .tit {
            line-height: 28px;
            float: left;
            color: #999;
            margin-right: 20px;
        }

        .shu-list {
            display: inline-block;
            /* float: left; */
            width: 592px;
        }

        ul {
            list-style: none;
        }

        .sku {
            width: 602px;
            margin-top: -10px;
            display: inline-block;
        }

        .sku li {
            float: left;
            margin: 10px 10px 0 0;
        }

        .sku li a {
            border: 1px #dcdcdc solid;
            padding: 4px 10px;
            font-size: 12px;
            display: inline-block;
            color: #555;
        }

        .sku-box {
            margin-top: 20px;
        }

        .stock {
            margin-top: 20px;
            width: 100%;
            display: inline-block;
        }



        .d1 {
            font-size: 12px !important;
            margin-top: 5px !important;
            margin-left: 10px !important;
        }

        .buybtn {
            margin: 20px 0 0 48px;
            height: 44px;
        }

        .buybtn .sp {
            padding: 4px 40px;
            float: left;
            border: 1px #f46 solid;
            padding: 6px 60px;
            font-size: 20px;
            color: #f46;
            background: #ffeff2;
        }

        .buybtn .sr {
            float: left;
            background: #f46;
            color: white;
            font-size: 20px;
            padding: 7px 40px;
            margin-left: 10px;
        }

        .buybtn .sr i {
            width: 20px;
            height: 18px;
            display: inline-block;
            vertical-align: middle;
            margin-top: -2px;
            margin-right: 6px;
            background-image: url(https://shop.hanfuhui.com/Image/base_icon.png) no-repeat -88px -237px;
        }
    </style>
</head>

<body>

    <body style="background-color: #ffffff;">
        <header>
            <div class="header-to">
                <div class="header-to2">
                    <p class="header-logo"></p>
                    <div class="header-zh">
                        <p><a href="../登录/注册.html">注册</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a href="../登录/登录.html">登录</a></p>
                    </div>
                    <p class="header-fr">
                        <input type="text" class="fr2" placeholder="请输入你想搜索的商品或店铺">
                        <a href=""></a>
                    </p>
                </div>
            </div>
        </header>

        <!-- <> -->
        <div class="nav-fr">
            <div class="nav-fr-r">
                <ul>
                    <a href="../首页/./首页.html">首页</a>
                    <a href="../萌宠库/./萌物库.html">萌物库</a>
                    <a href="../品牌馆/./品牌馆.html">品牌馆</a>
                    <a href="">同袍社区</a>
                    <div class="nav-r">
                        <a href="" style="color: #f46;"><i></i>店铺入住</a>
                    </div>
                </ul>
            </div>
        </div>
        <div class="gowu">
            <!-- <figure>
            <div style="position: relative;">
                <div class="life">
                    <div class="face-box">
                        <img src="	https://pic.hanfugou.com/web/2020/10/9/0/d1626f25cd924cf5b404344607faac90.jpg_lo450.jpg"
                            alt="">
                    </div>
                    <div class="right">
                        <p class="title">
                            天机云锦 月光嘉年华 衬衣阔腿裤八分马面披风改良汉元素男女同款</p>
                        <div class="price-box">
                            <div class="price">
                                <i>￥</i>
                                <span class="now">129.0-255.0</span>
                            </div>
                            <div class="fr">
                                <i>517</i>
                                <p class="sale">交易成功：</p>
                            </div>
                        </div>
                        <div class="sku-box" >
                            <div class="shu">
                                <span class="tit"></span>
                                <div class="shu-list">
                                    <ul class="sku">
                                        <span class="tit">尺码</span>
                                        <li><a href="">s</a></li>
                                        <li><a href="">m</a></li>
                                        <li><a href="">l</a></li>
                                    </ul>
                                </div>
                            </div>
                            <div class="shu">
                                <span class="tit">样式</span>
                                <div class="shu-list">
                                    <ul class="sku">
                                        <li><a href="">八分阔腿裤 55天工期</a></li>
                                        <li><a href="">八分马面裙 55天工期</a></li>
                                        <li><a href="">披风 55天工期</a></li>
                                        <li><a href=""> 衬衣 55天工期</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="stock">
                            <div class="cont">
                                <span class="tit">库存</span>
                                <span class="d1"> 270件</span>
                            </div>
                        </div>
                        <div class="buybtn">
                            <a href="" class="sp">立刻剁手</a>
                            
                            <a href="" class="sr">
                                <i></i> 加入购物车</a>
                        </div>
                    </div>
                </div>

            </div>
        </figure> -->
        </div>
        <script src="s.js"></script>





        <footer style="margin-top: 500px;">
            <div class="food" style="text-align:center ; color: white;">
                <div class="main-6">
                    <a href="">关于我们</a>
                    <i>|</i>
                    <a href="">社区公约</a>
                    <i>|</i>
                    <a href="">用户协议</a>
                    <i>|</i>
                    <a href="">隐私政策</a>
                    <i>|</i>
                    <a href="">帮助我们</a>
                </div>
                <div class="main-7" style="margin-top: 20px; color: #555;">
                    <a href="" style="height: 36px;
    width: 27px;
    display: inline-block;
    position: relative;
    left: -17px;
    top: -2px;
    vertical-align: middle;"><img src="../首页/./ebs_icon.png" alt=""></a>
                    Copyright ©2018 深圳市汉服荟网络科技有限公司 版权所有 <a href="">粤ICP备14046913号-5</a>
                    电话：0755-21503399</div>
            </div>
        </footer>

    </body>

</html>